<template>
	<view class="content bgc-f0">
		<view class="p26 bgc-fff search_sticky">
			<u-search 
				placeholder="请输入产品名称" 
				v-model="value" 
				shape="round" 
				@custom="getProList" 
				@blur="getProList" 
				@search="getProList"
			/>
		</view>

		<view class="p20">
			<view class="subtitle"><text class="c-theme">全部项目</text></view>

			<!--全部项目-->
			<view class="_list z-flex z-flex-between" style="flex-wrap: wrap;">
<!-- 				<view class="_li" @click="handDefinePrice">
					<view class="bd1" style="width: 100%;min-height: 300rpx;max-height: 400rpx;"></view>
					<view class="c-666 fs28 mt12 mb14">补差价产品</view>
					<view class="c-red">
						<text class="fs26">￥</text> 
						<text class="fs24 ml4">自定义价格</text> 
					</view>
				</view> -->
				<template v-for="(item,index) in list">
					<view class="_li" :key="index" @click="handViewInfo(item.id)">
						<u-image :src="item.cover" width="100%" height="320rpx"></u-image>
						<view class="c-666 fs28 mt12 mb14 u-line-1">{{item.name}}</view>
						<view class="c-red">
							<text class="fs26">￥</text>
							<text class="fs30 ml6">{{item.price}}</text> 
						</view>
					</view>
				</template>
			</view>
		</view>
		<vempty type="data" v-if="datalen" title="暂无数据"></vempty>
		<footerBottom>
			<view class="_add" @click="handAdd">
				新增产品
			</view>
		</footerBottom>
	</view>
</template>

<script>
	import { productListApi } from '@/api/shop.js'
	export default {
		data() {
			return {
				list: [],
				current: 0,
				datalen: false,
				option: {},
				value: ''
			}
		},
		onLoad(option) {
			option && (this.option = option)
		},
		onShow() {
			this.$nextTick(this.getProList)
		},
		onReady() {},
		watch: {},
		computed: {},
		methods: {
			async getProList(){
				uni.showLoading({
					title: '数据加载中...'
				})
				const businessId = this.option.id
				const {code,data} = await productListApi({businessId,name: this.value})
				uni.hideLoading()
				uni.stopPullDownRefresh()
				if(code !=0 ) return
				this.list = data.list
				this.datalen = data.list.length == 0
			},
			handViewInfo(id) {
				uni.$u.route({
					type: 'navigateTo',
					url: 'mapPages/shop_info/index',
					params: {
						id
					}
				})
			},
			handAdd(){
				uni.$u.route({
					url: 'mapPages/backAdmin/pro_add/index',
					params: {
						id: this.option.id,
						navTile: '新增产品',
						pageType: 'add'
					}
				})
			}
			// handDefinePrice() {
			// 	uni.$u.route({
			// 		type: 'navigateTo',
			// 		url: 'mapPages/define_price/index'
			// 	})
			// },
		}
	}
</script>

<style scoped lang="scss">
	.content {
		._add{
			padding: 16rpx;
			background-color: $uni-color-theme;
			color: #FFFFFF;
			text-align: center;
			border-radius: 40rpx;
			width: 88%;
			margin: 0 auto;
			position: relative;
			top: 50%;
			transform: translateY(-50%);
		}
		._list {
			._li {
				width: 48.5%;
				height: auto;
				background-color: #fff;
				padding: 30rpx;
				border-radius: 12rpx;
				margin-bottom: 24rpx;
			}
		}
	}
</style>
